<template>
  <div class="shopaddress">
    <!-- 个人资料 -->

    <van-nav-bar
      title="收获地址"
      left-text=""
      left-arrow
      @click-left="onClickLeft"
      fixed
      placeholder
    />

    <van-address-list
      v-model="chosenAddressId"
      :list="list"
      :disabled-list="disabledList"
      disabled-text="以下地址超出配送范围"
      default-tag-text="默认"
      @add="onAdd"
      @edit="onEdit"
    />
  </div>
</template>

<script>
import { Toast } from "vant"

export default {
  created() {
    // 获取用户的地址列表
    this.getAddressList()
  },

  data() {
    return {
      chosenAddressId: "1",
      list: [],
      listitem: [],
      disabledList: [],
    }
  },

  methods: {
    // 获取用户地址列表
    getAddressList() {
      this.$api.my.myAddressList().then((res) => {
        console.log(res)
        // 修改对象中的键名
        let arr = res.data
        this.listitem = res.data
        let newarr = arr.map((item) => {
          return {
            id: item["address_id"],
            name: item["address_name"],
            tel: item["address_tel"],
            address: item["address_address"],
            isDefault: item["address_isDefault"],
          }
        })

        this.list = newarr
      })
    },

    onClickLeft() {
      this.$router.push("/my")
    },

    onAdd() {
      // Toast("新增地址")
      this.$router.push("/addaddress")
    },

    onEdit(item, index) {
      Toast("编辑地址:" + item.id)
      let data = this.listitem.filter((items) => {
        return items.address_id === item.id
      })
      console.log(data)

      // 路由带参跳转页面
      this.$router.push({
        path: "/addaddress",
        query: {
          data,
        },
      })
    },
  },
}
</script>

<style lang="less" scoped></style>
